<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta content="width=device-width, initial-scale=1.0" name="viewport">
    <script src="static/assets/js/echarts.min.js"></script>

    <title>Gitee 2021全部推荐项目 数据分析</title>
    <meta content="" name="descriptison">
    <meta content="" name="keywords">

    <!-- Favicons -->
    <link href="static/assets/img/favicon.png" rel="icon">
    <link href="static/assets/img/apple-touch-icon.png" rel="apple-touch-icon">

    <!-- Google Fonts -->
    <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i|Raleway:300,300i,400,400i,600,600i,700,700i,900"
          rel="stylesheet">

    <!-- Vendor CSS Files -->
    <link href="static/assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <link href="static/assets/vendor/icofont/icofont.min.css" rel="stylesheet">
    <link href="static/assets/vendor/boxicons/css/boxicons.min.css" rel="stylesheet">
    <link href="static/assets/vendor/animate.css/animate.min.css" rel="stylesheet">
    <link href="static/assets/vendor/venobox/venobox.css" rel="stylesheet">
    <link href="static/assets/vendor/aos/aos.css" rel="stylesheet">

    <!-- Template Main CSS File -->
    <link href="static/assets/css/style.css" rel="stylesheet">

</head>

<body>


<!-- ======= Header ======= -->
<header id="header">
    <div class="container">

        <div class="logo float-left">
            <h1 class="text-light"><a href="temp.html"><span>Mamba</span></a></h1>
            <!-- Uncomment below if you prefer to use an image logo -->
            <!-- <a href="temp.html"><img src="static/assets/img/logo.png" alt="" class="img-fluid"></a>-->
        </div>

      <nav class="nav-menu float-right d-none d-lg-block">
        <ul>
          <li><a href="/index">首页<i class="la la-angle-down"></i></a></li>
          <li><a href="/projects">所有项目</a></li>
          <li class="active"><a href="/score">统计</a></li>
          <li><a href="/word">词云</a></li>
          <li><a href="/team">团队</a></li>

        </ul>
      </nav><!-- .nav-menu -->

    </div>
</header><!-- End Header -->

<!-- ======= Our Team Section ======= -->
<section id="team" class="team">
    <div class="container">
        <div class="section-title">
            <h2>Gitee 2021全部推荐项目 数据分析</h2>
        </div>

        <!-- ======= Counts Section ======= -->
        <section class="counts section-bg">
            <div class="container">
                <!-- 为 ECharts 准备一个具备大小（宽高）的 DOM -->
                <div id="main" style="width: 100%;height:1000px"></div>
            </div>
        </section><!-- End Counts Section -->


                <!-- ======= Counts Section ======= -->
        <section class="counts section-bg">
            <div class="container">
                <!-- 为 ECharts 准备一个具备大小（宽高）的 DOM -->
                <div id="bingtu" style="width: 100%;height:1000px"></div>
            </div>
        </section><!-- End Counts Section -->

    </div>
</section><!-- End Our Team Section -->

<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js">
</script>
<script type="text/javascript">


var chartDom = document.getElementById('main');
var myChart = echarts.init(chartDom);
var option;


option = {
    xAxis: {
        max: 'dataMax',
    },
    yAxis: {
        type: 'category',
        data: {{namelist | tojson}},
        inverse: true,
        animationDuration: 300,
        animationDurationUpdate: 300,
        max: 99 // only the largest 3 bars will be displayed
    },
    series: [{
        realtimeSort: true,
        name: '用户star数量排名 前一百',
        type: 'bar',
        data: {{starlist | tojson}},
        label: {
            show: true,
            position: 'right',
            valueAnimation: true
        }
    }],
    legend: {
        show: true
    },
    animationDuration: 0,
    animationDurationUpdate: 3000,
    animationEasing: 'linear',
    animationEasingUpdate: 'linear'
};




option && myChart.setOption(option);




var chartDom2 = document.getElementById('bingtu');
var myChart2 = echarts.init(chartDom2);
var option2;

option2 = {
    backgroundColor: '#2c343c',

    title: {
        text: 'Customized Pie',
        left: 'center',
        top: 20,
        textStyle: {
            color: '#ccc'
        }
    },

    tooltip: {
        trigger: 'item'
    },

    visualMap: {
        show: false,
        min: 4,
        max: 150,
        inRange: {
            colorLightness: [1, 0]
        }
    },
    series: [
        {
            name: '100个项目中，推荐项目比例',
            type: 'pie',
            radius: '55%',
            center: ['50%', '50%'],
            data: {{ analy | tojson }}.sort(function (a, b) { return a.value - b.value; }),
            roseType: 'radius',
            label: {
                color: 'rgba(255, 255, 255, 0.3)'
            },
            labelLine: {
                lineStyle: {
                    color: 'rgba(255, 255, 255, 0.3)'
                },
                smooth: 0.2,
                length: 10,
                length2: 20
            },
            itemStyle: {
                color: '#c23531',
                shadowBlur: 200,
                shadowColor: 'rgba(0, 0, 0, 0.5)'
            },

            animationType: 'scale',
            animationEasing: 'elasticOut',
            animationDelay: function (idx) {
                return Math.random() * 200;
            }
        }
    ]
};
option2 && myChart2.setOption(option2);
</script>


<!-- ======= Footer ======= -->
<footer id="footer">


    <div class="container">
        <div class="copyright">
            &copy; Copyright <strong><span>Mamba</span></strong>. All Rights Reserved
        </div>

    </div>
</footer><!-- End Footer -->

<a href="#" class="back-to-top"><i class="icofont-simple-up"></i></a>

<!-- Vendor JS Files -->
<script src="static/assets/vendor/jquery/jquery.min.js"></script>
<script src="static/assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="static/assets/vendor/jquery.easing/jquery.easing.min.js"></script>
{#  <script src="static/assets/vendor/php-email-form/validate.js"></script>#}
<script src="static/assets/vendor/jquery-sticky/jquery.sticky.js"></script>
<script src="static/assets/vendor/venobox/venobox.min.js"></script>
<script src="static/assets/vendor/waypoints/jquery.waypoints.min.js"></script>
<script src="static/assets/vendor/counterup/counterup.min.js"></script>
<script src="static/assets/vendor/isotope-layout/isotope.pkgd.min.js"></script>
<script src="static/assets/vendor/aos/aos.js"></script>

<!-- Template Main JS File -->
<script src="static/assets/js/main.js"></script>

</body>

</html>